<?php
use yii\helpers\Url;
?>
<div class="row">
    <div class="col-xs-12">
        <div class="banner">
            <label>TRANG PHỤC</label>
            <ul>
                <li><a href="#">Áo khoác</a></li>
                <li><a href="#">Áo sơ mi</a></li>
                <li><a href="#">Áo thun</a></li>
                <li><a href="#">Quần</a></li>
                <li><a href="#">Đồ lót</a></li>
            </ul>
        </div>
    </div>
</div>
<div class="row bottom-40">
    <div class="full-info">
        <div class="col-xs-5">
            <img src="<?php echo Url::to('@web/images/detail-1.jpg')?>" class="img-responsive">
        </div>
        <div class="col-xs-7 info">
            <label class="title">[1234] Áo Khoác Nỉ Nam Giả Vest Áo Khoác Nỉ Nam Giả Vest Áo Khoác Nỉ Nam Giả Vest</label>
            <ul>
                <li><label>GIÁ</label><span class="price">560,000 VNĐ</span></li>
                <li><label>KIỂU SẢN PHẨM</label><span>Áo thun</span></li>
                <li><label>CHẤT LIỆU</label><span>Thun / Spandex</span></li>
                <li><label>XUẤT XỨ</label><span>Việt Nam</span></li>
                <li><label>MÀU SẮC</label><span class="color">
                        <div><p style="background-color: #11121E"></p></div>
                        <div><p style="background-color: #B5AE9E"></p></div>
                        <div><p style="background-color: #402E2A"></p></div>
                    </span></li>
                <li><label>KÍCH THƯỚC</label><span>S / M / L</span></li>
                <li><label>SHARES</label><span class="share"><i class="fa fa-facebook-official"></i><i class="fa fa-google-plus-square"></i></span></li>
            </ul>
            <div class="book">
                <div class="row">
                    <div class="col-xs-6 left gray">
                        Lượt xem: 1000
                    </div>
                    <div class="col-xs-6">
                        <button class="btn-shop-default" id="btn-show-book"><i class="fa fa-cart-plus"></i>Đặt mua</button>
                    </div>
                </div>
            </div>
            <div id="book-info" style="display: none;">
                <form id="book">
                    <div class="row bottom-5">
                        <label class="col-xs-3 book-label">SỐ LƯỢNG</label>
                        <div class="col-xs-2">
                            <input type="number" required="required" class="col-xs-12" min="1" value="1">
                        </div>
                    </div>
                    <div class="row bottom-5">
                        <label class="col-xs-3 book-label">KÍCH THƯỚC</label>
                        <div class="col-xs-9 size">
                            <input type="radio" id="size-1" name="size" value="S"/>
                            <label for="size-1"><div class="size">S</div></label>
                            <input type="radio" id="size-2" name="size" value="M"/>
                            <label for="size-2"><div class="size">M</div></label>
                            <input type="radio" id="size-3" name="size" value="L"/>
                            <label for="size-3"><div class="size">L</div></label>
                        </div>
                    </div>
                    <div class="row bottom-5">
                        <label class="col-xs-3 book-label">MÀU SẮC</label>
                        <div class="col-xs-9">
                            <input type="radio" id="color-1" name="color" value="1"/>
                            <label for="color-1"><div class="color" style="background-color: #11121E"></div></label>
                            <input type="radio" id="color-2" name="color" value="2"/>
                            <label for="color-2"><div class="color" style="background-color: #B5AE9E"></div></label>
                            <input type="radio" id="color-3" name="color" value="3"/>
                            <label for="color-3"><div class="color" style="background-color: #402E2A"></div></label>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-xs-12 right">
                            <button class="btn-cl btn-shop-default" type="button" id="btn-book-close"><i class="fa fa-times"></i>Hủy</button>
                            <button class="btn-su btn-shop-default" type="button" id="btn-book-oke"><i class="fa fa-check"></i>Đồng ý</button>
                        </div>
                    </div>
                </form>
            </div>
            <div id="contact-us">
                <div class="row">
                    <div class="col-xs-8">
                        <label>Liên hệ</label>
                        <ul>
                            <li><i class="glyphicon glyphicon-earphone"></i>Tel: 047.309.5555 - 047.309.5555</li>
                            <li><i class="fa fa-skype"></i>Skype: logoshop</li>
                            <li><i class="fa fa-yahoo"></i>Yahoo: logoshop</li>
                            <li><i class="glyphicon glyphicon-envelope"></i>Email: lienhe@shop.com</li>
                            <li><a href="#"><i class="fa fa-cart-plus"></i>Hướng dẫn thanh toán</a></li>
                        </ul>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<div class="row">
    <div class="col-xs-12">
        <i class="glyphicon glyphicon-bookmark"></i><br />
        <label>CHI TIẾT</label>
    </div>
    <div class="col-xs-11 col-xs-offset-1">
        <img src="<?php echo Url::to('@web/images/detail-01.jpg');?>" class="img-responsive">
        <img src="<?php echo Url::to('@web/images/detail-02.jpg');?>" class="img-responsive">
        <img src="<?php echo Url::to('@web/images/detail-03.jpg');?>" class="img-responsive">
        <img src="<?php echo Url::to('@web/images/detail-04.jpg');?>" class="img-responsive">
        <img src="<?php echo Url::to('@web/images/detail-05.jpg');?>" class="img-responsive">
        <img src="<?php echo Url::to('@web/images/detail-06.jpg');?>" class="img-responsive">
    </div>
    <div class="col-xs-12">
        <i class="glyphicon glyphicon-bookmark"></i><br />
        <label>BẠN CÓ THỂ QUAN TÂM</label>
    </div>
    <div class="list-cater">
        <ul>
            <li class="col-xs-3">
                <a href="#">
                    <img src="<?php echo Url::to('@web/images/4.jpg');?>" class="img-responsive">
                </a>
                <div class="short-info">
                    <img src="<?php echo Url::to('@web/images/best.gif');?>">
                    <p>Áo Khoác Nỉ Nam Giả Vest Áo Khoác Nỉ Nam Giả Vest Áo Khoác Nỉ Nam Giả Vest</p>
                    <span>(S/M/L)</span>
                    <label class="price">560,000 VND</label>
                </div>
            </li>
            <li class="col-xs-3">
                <a href="#">
                    <img src="<?php echo Url::to('@web/images/4.jpg');?>" class="img-responsive">
                </a>
                <div class="short-info">
                    <img src="<?php echo Url::to('@web/images/best.gif');?>">
                    <p>Áo Khoác Nỉ Nam Giả Vest</p>
                    <span>(S/M/L)</span>
                    <label class="price">560,000 VND</label>
                </div>
            </li>
            <li class="col-xs-3">
                <a href="#">
                    <img src="<?php echo Url::to('@web/images/4.jpg');?>" class="img-responsive">
                </a>
                <div class="short-info">
                    <img src="<?php echo Url::to('@web/images/best.gif');?>">
                    <p>Áo Khoác Nỉ Nam Giả Vest</p>
                    <span>(S/M/L)</span>
                    <label class="price">560,000 VND</label>
                </div>
            </li>
            <li class="col-xs-3">
                <a href="#">
                    <img src="<?php echo Url::to('@web/images/4.jpg');?>" class="img-responsive">
                </a>
                <div class="short-info">
                    <img src="<?php echo Url::to('@web/images/best.gif');?>">
                    <p>Áo Khoác Nỉ Nam Giả Vest</p>
                    <span>(S/M/L)</span>
                    <label class="price">560,000 VND</label>
                </div>
            </li>
        </ul>
    </div>
</div>